<template>
  <el-dialog
    v-dialogDrag
    :visible="isDialogVisible"
    :title="titleName"
    center
    width="70%"
    :append-to-body="true"
    :close-on-click-modal="false"
    @close="closeEdit"
  >
    <dialogHeader slot="title" :title="titleName" :style-type="$store.state.app.dialogType" />
    <div class="filter-container filter-params">
      <one-table-template
        ref="multipleTable"
        :dynamic-buttons="Buttons"
        :dynamic-components="tableComponents"
        :dynamic-form-fields="formField"
        :dynamic-is-show-more-btn="true"
        :dynamic-is-show-select="true"
        :dynamic-export-converts="dynamicExportConverts"
      />
    </div>
  </el-dialog>
</template>

<script>
import dialogHeader from '@/components/dialogHeader'
import OneTableTemplate from '@/components/templates/oneTable'
import { formMixins } from '@/components/mixins/formMixins'
export default {
  components: {
    dialogHeader,
    OneTableTemplate
  },
  mixins: [formMixins],
  props: {
    isDialogVisible: {
      type: Boolean,
      default: false
    },
    dataForForm: {
      type: Object,
      default: () => {}
    },
    titleName: {
      type: String,
      default: ''
    }
  },
  data() {
    // 页面标识（与上面beforeRouteEnter中的对应）
    const viewPageCode = this.$route.path
    // 绑定事件配置化事件
    this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode])
    return {
      editPopupsState: 'add',
      // 动态组件-查询条件
      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableComponents
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode]
            .tableComponents
          : [
            {
              compKey: 'compKey1',
              labelName: '内饰颜色编码：',
              codeField: 'carInColorCode',
              disabled: true,
              isRequire: true,
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 8
            },
            {
              compKey: 'compKey2',
              labelName: '内饰颜色名称：',
              codeField: 'carInColorName',
              lookuptype: 'DB0064',
              isRequire: true,
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 8
            },
            {
              compKey: 'compKey3',
              labelName: '状态：',
              codeField: 'isEnable',
              isRequire: true,
              component: () => import('@/components/org/isEnable/isEnableOne'),
              type: 'dropdownList',
              isMust: true,
              span: 8
            },
            {
              compKey: 'compKey4',
              labelName: '价格：',
              codeField: 'carInColorPrice',
              isRequire: true,
              validrule: {
                isformat: /^([1-9]\d{0,10}|[1-9][0-9]{0,10}\.\d{1,2}|0\.\d{1,2}?|0)$/,
                resectMessage: {
                  isformat: '请输入正确的价格!'
                }
              },
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 8
            }
          ],
      // form 的表单对象
      formField: this.$utils.getFormField(
        this,
        {
          carInColorCode: '',
          carInColorName: '',
          isEnable: '1',
          carInColorPrice: ''
        },
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode]
      ),
      // 动态组件-按钮
      Buttons:
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode] &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons &&
        this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[viewPageCode].tableButtons
          : [
            {
              compKey: 'btnKey1',
              type: 'primary',
              size: 'small',
              name: 'search',
              clickEvent: () => this.save(),
              text: '保存'
            },
            {
              compKey: 'btnKey2',
              type: '',
              size: 'small',
              icon: 'iconfont  icon-cancel',
              clickEvent: () => this.closeEdit(1),
              text: '取消'
            }
          ]
    }
  },
  mounted() {
    this.formField = Object.assign(this.formField, this.dataForForm)
    switch (this.formField.isEnableCode) {
      case '启用':
        this.formField.isEnable = '1'
        break
      case '停用':
        this.formField.isEnable = '0'
    }
  },
  methods: {
    // 关闭弹窗
    closeEdit(type) {
      this.$emit('closeEdit', type)
    },

    // 保存
    save() {
      this.$utils.validataMoth(this, 'validpage')
      if (this.valid) {
        this.$requestAPI({
          apiUrl: '/mp/e3sh/vesale/basics/carInColorService/updateCarInColor.do',
          variables: this.formField
        }).then(res => {
          if (res.result === '1') {
            this.$message.success(res.msg)
            this.$parent.queryTable(1)
            this.$emit('update:isDialogVisible', false)
          }
        })
      }
    }
  }
}
</script>
